<template>
	<view>

		<u-radio-group placement="column" v-model="checkId">
			<view v-for="(item,k) in list" :key="k" class="card">
				<view @click="handleGoBack(item)">
					<view class="flex align-center">
						<view style="width: 120rpx;">{{item.name}}</view>
						<view class="">{{item.phone}}</view>
					</view>
					<view class="u-p-t-30 u-p-b-30 solid-bottom">{{item.area}} {{item.detailsAddress}}</view>
				</view>

				<view class="u-p-t-20 flex align-center justify-between">
					<u-radio @change="setDef(k)" label="设为默认地址" :name="item.id" labelSize="13" size="16"
						activeColor="#FF5B00"></u-radio>
					<view class="flex align-center">
						<view @click="$u.route('/pages/personal/address/edit',{id:item.id})" class="btn">编辑</view>
						<view @click="delUserAddressInfo(item.id)" class="btn">删除</view>
					</view>
				</view>
			</view>
		</u-radio-group>

		<view style="height: 200rpx;"></view>

		<view class="u-m-l-20 u-m-r-20 footer">
			<u-button @click="$u.route('/pages/personal/address/edit')" type="primary" shape="circle" color="#FF5B00"
				text="添 加"></u-button>
		</view>

	</view>
</template>

<script>
	import {
		getUserAddressInfo,
		delUserAddressInfo,
		addUserAddressInfo
	} from '@/common/api/api.js'
	export default {
		data() {
			return {
				checkId: '',
				params: {
					pageNum: 1,
					pageSize: 20,
					userInfoId: '',
					isBack:false,
				},
				list: [],
			}
		},
		onLoad(options) {
			if(options.isBack){
				this.isBack=true;
			}
			
			this.getUserAddressInfo();
		},
		methods: {
			refresh() {
				this.params.pageNum = 1;
				this.list = [];
				this.getUserAddressInfo();
			},
			// 选中地址的跳转
			handleGoBack(item) {
				if(this.isBack){
					// 返回时传递数据
					uni.navigateBack({
						delta: 1,
						success: () => {
							uni.$emit('addressBack', item)
						}
					})
									
				}
					
			},
			//地址列表
			getUserAddressInfo() {
				this.params.userInfoId = this.$store.state.$token;
				getUserAddressInfo(this.params).then(res => {
					this.list = res.data.list;
					this.list.map(e => {
						if (e.status == '1') {
							this.checkId = e.id;
						}
					})
				})
			},
			//删除地址
			delUserAddressInfo(addrId) {
				delUserAddressInfo({
					id: addrId
				}).then(res => {
					this.refresh();
				})
			},
			//设置默认地址
			setDef(index) {
				let form = this.list[index];
				this.$set(form, 'status', '1');
				addUserAddressInfo(form).then(res => {
					console.log(res)
				})
			}
		}
	}
</script>

<style lang="scss">
	.card {
		padding: 20rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
		margin: 16rpx;

		.btn {
			color: #999;
			width: 100rpx;
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			border: 1rpx solid #e3e3e3;
			margin-left: 32rpx;
			border-radius: 100rpx;
			font-size: 26rpx;
		}
	}

	.footer {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #fff;
		padding-bottom: 40rpx;
		padding-top: 20rpx;
	}
</style>